<template>
  <div>
    <div class="box-border p-12px">
      <div>
        <SubTitle title="基本信息" />
        <!-- 文件 -->
        <template v-if="props.params.dataType === 'file'">
          <el-descriptions :column="1">
            <el-descriptions-item
              :label="item.label"
              v-for="(item, index) in fileDesc"
              :key="index"
            >
              <span v-if="item.key == 'fileFingerprint'">
                <el-tooltip placement="top" :content="props.params.md5?.toString() || '无'">
                  <span>MD5,</span>
                </el-tooltip>
                <el-tooltip placement="top" :content="props.params.kfs?.toString() || '无'">
                  <span>KFS,</span>
                </el-tooltip>
                <el-tooltip placement="top" :content="props.params.pfs?.toString() || '无'">
                  <span>PFS,</span>
                </el-tooltip>
                <el-tooltip placement="top" :content="props.params.psa?.toString() || '无'">
                  <span>PSA</span>
                </el-tooltip>
              </span>
              <span v-else>{{ props.params[item.key] || '--' }}</span>
            </el-descriptions-item>
          </el-descriptions>
        </template>
        <template v-if="props.params.dataType === 'column'">
          <el-descriptions :column="1">
            <el-descriptions-item
              :label="item.label"
              v-for="(item, index) in columnDesc"
              :key="index"
            >
              <span>{{ props.params[item.key] || '--' }}</span>
            </el-descriptions-item>
          </el-descriptions>
        </template>
        <template v-if="props.params.dataType === 'table'">
          <el-descriptions :column="1">
            <el-descriptions-item
              :label="item.label"
              v-for="(item, index) in tableDesc"
              :key="index"
            >
              <span>{{ props.params[item.key] || '--' }}</span>
            </el-descriptions-item>
          </el-descriptions>
        </template>
      </div>
      <div class="mt-16px">
        <SubTitle title="分类分级信息" />
        <el-descriptions :column="1" class="mt-16px">
          <el-descriptions-item
            v-for="(columnItem, columnIndex) in columnList"
            :key="columnIndex"
            :label="columnItem.name"
          >
            <span v-if="columnItem.index == '1'">
              {{ props.params.handClassificationName || props.params.classificationName }}
            </span>
            <span v-else-if="columnItem.index == '2'">
              {{ props.params.handLevelName || props.params.levelName }}
            </span>
            <span v-else>
              {{ props.params[`institutionFiled${columnItem.index}`] || '--' }}
            </span>
          </el-descriptions-item>
          <el-descriptions-item
            v-for="(extendItem, extendIndex) in extendList"
            :key="extendIndex"
            :label="extendItem.name"
          >
            <span v-if="extendItem.index == '3'">
              {{ props.params.deadlineLevelName }}
            </span>
            <span v-else>
              {{ props.params[`field${extendItem.index}`] || '--' }}
            </span>
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </div>
    <div>
      <el-button @click="closeOutDrawer">关闭</el-button>
    </div>
  </div>
</template>
<script lang="ts" setup>
import * as assuranceApi from '@/api/dataStandards/assurance/index'
import { infoPage } from '@/api/dataStandards/info/index'
import SubTitle from '@/components/SubTitle/index.vue'
const message = useMessage() // 消息弹窗
const { proxy } = getCurrentInstance() as any

const props = defineProps({
  params: {
    type: Object,
    default: () => {}
  },
  closeOutDrawer: Function
})

const columnDesc = [
  { label: '字段名称：', key: 'column' },
  { label: '字段类型：', key: 'columnType' },
  { label: '字段描述：', key: 'comment' },
  { label: '所属表：', key: 'table' },
  { label: '所属schema：', key: 'schema' },
  { label: '所属库：', key: 'database' },
  { label: '归属机构：', key: 'deptName' },
  { label: '归属系统：', key: 'sysName' },
  { label: '数据标准：', key: 'templateName' }
]
const tableDesc = [
  { label: '表名称：', key: 'table' },
  { label: '表描述：', key: 'remark' },
  { label: '所属schema：', key: 'schema' },
  { label: '所属库：', key: 'database' },
  { label: '归属机构：', key: 'deptName' },
  { label: '归属系统：', key: 'sysName' },
  { label: '数据标准：', key: 'templateName' }
]
const fileDesc = [
  { label: '文件名称：', key: 'fileName' },
  { label: '文件类型：', key: 'fileType' },
  { label: '文件大小：', key: 'fileSize' },
  { label: '文件指纹：', key: 'fileFingerprint' },
  { label: '归属机构：', key: 'deptName' },
  { label: '归属系统：', key: 'sysName' },
  { label: '数据标准：', key: 'templateName' }
]
const extendList = ref([
  {
    index: '1',
    name: '',
    required: '',
    fillingMethod: '输入框',
    presetContentMap: []
  }
])

// 获取模板扩展字段列表
const getInfoList = async () => {
  const data = await infoPage({
    page: 1,
    pageSize: 20,
    dataStandardId: props.params.template,
    display: '1'
  })
  extendList.value = data.map((item) => {
    return {
      ...item,
      presetContentMap: item.presetContent ? JSON.parse(item.presetContent) : []
    }
  })
}

const columnList = ref([
  {
    index: '1',
    name: '',
    required: '',
    fillingMethod: '输入框',
    presetContentMap: []
  }
])
// 获取制度信息字段列表
const getAssuranceList = async () => {
  const data = await assuranceApi.assurancePage({
    dataStandardId: props.params.template,
    display: 1,
    page: 1,
    pageSize: 20
  })
  if (data.length > 0) {
    columnList.value = data
  } else {
    columnList.value = []
  }
}

onMounted(() => {
  getInfoList()
  getAssuranceList()
})
</script>

<style scoped lang="scss">
:deep(.el-table .el-form-item--default) {
  margin-bottom: 0 !important;
}
</style>
